#![allow(non_snake_case)]

use chrono::{Datelike, NaiveDate};
use leptos::{html, prelude::*};
use leptos_icons::*;
use icondata as i;
use shq_common::prelude::Size;
use super::panel::{Panel, PanelRef};
use thaw_components::{Follower, FollowerPlacement};
use thaw_utils::{now_date, ArcOneCallback, BoxOneCallback, ComponentRef, Model, SignalWatch};
use crate::_binder::Binder;
use crate::{date_picker::panel::PanelVariant, input::{Input, InputSuffix}, InputPrefix};

#[component]
pub fn YearPicker(
    #[prop(optional, into)] value: Model<Option<i32>>,
    #[prop(optional, into)] placeholder: MaybeProp<String>,
    #[prop(optional, into)] on_change: Option<BoxOneCallback<Option<i32>>>,
    #[prop(optional, into)] size: MaybeProp<Size>,
    #[prop(optional)] input_prefix: Option<InputPrefix>,
    #[prop(optional)] input_suffix: Option<InputSuffix>,
    #[prop(optional, into)] disabled: MaybeProp<bool>,
    #[prop(default=true.into(), into)] border: MaybeProp<bool>,
    #[prop(optional)] inner_max_width: u32,
    #[prop(optional)] is_init_focus: bool,
) -> impl IntoView {
    let date_picker_ref = NodeRef::<html::Div>::new();
    let is_show_panel = RwSignal::new(false);
    let show_date_text = RwSignal::new(None::<String>);
    let update_show_date_text = move || {
        value.with_untracked(move |year| {
            let text = year.as_ref().map_or(None, |year| {
                Some(format!("{}", year))
            });
            show_date_text.set(text);
        });
    };
    update_show_date_text();
    let panel_ref = ComponentRef::<PanelRef>::default();
    let panel_selected_date = RwSignal::new(None::<NaiveDate>);
    _ = panel_selected_date.watch(move |date| {
        let text = date.as_ref().map_or(None, |date| {
            Some(date.year().to_string())
        });
        show_date_text.set(text);
    });

    let on_input_blur = BoxOneCallback::new(move |_| {
        // if let Ok(date) = show_date_text.get().parse::<i32>()
        // {
        //     if value.get_untracked() != Some(date) {
        //         value.set(Some(date));
        //         update_show_date_text();
        //     }
        // } else {
        //     update_show_date_text();
        // }
    });

    let close_panel = ArcOneCallback::new(move |date: Option<NaiveDate>| {
        if date.is_none() {
            is_show_panel.set(false);
            return;
        }
        let year=date.map(|d|d.year());
        if value.get_untracked() != year {
            if let Some(on_change)=on_change.as_ref() {
                on_change(year);
            }
            value.set(year);
            update_show_date_text();
        }
        is_show_panel.set(false);
    });

    let open_panel = BoxOneCallback::new(move |_| {
        let date=value.get_untracked().map(|y|NaiveDate::from_ymd_opt(y, 1, 1).unwrap());
        panel_selected_date.set(date);
        if let Some(panel_ref) = panel_ref.get_untracked() {
            panel_ref.init_panel(date.unwrap_or(now_date()),PanelVariant::Year);
        }
        is_show_panel.set(true);
    });
    view! {
        <Binder>
            <div node_ref=date_picker_ref>
                <Input value=show_date_text on_focus=open_panel on_blur=on_input_blur border size disabled placeholder input_prefix inner_max_width is_init_focus>
                    <InputSuffix slot>
                        <Icon icon=i::AiCalendarOutlined style="font-size: 18px"/>
                        {if let Some(suffix) = input_suffix.and_then(|suffix| suffix.if_.then_some(suffix)) {
                            view! { {(suffix.children)()} }.into()
                        } else {
                            None
                        }}
                    </InputSuffix>
                </Input>
            </div>
            <Follower slot show=is_show_panel placement=FollowerPlacement::BottomStart>
                <Panel
                    date_picker_ref
                    close_panel
                    selected_date=panel_selected_date
                    comp_ref=panel_ref
                    is_show_panel
                    selected_variant=PanelVariant::Year.into()
                />
            </Follower>
        </Binder>
    }
}
